<script setup lang="ts">
import HelloWorld from './components/HelloWorld.vue'
import { storeToRefs } from 'pinia'
import { useCounterStore } from './stores/counter'
const counterStore = useCounterStore()
const { counter } = storeToRefs(counterStore)

counterStore.counter = 999

const btn_increment = () => {
  counterStore.increment()
  // increment()
}
</script>

<template>
  <!-- 直接从 store 中访问 state -->
  <div>Current Count: {{ counterStore.counter }}</div>
  <div>Current Count: {{ counter }}</div>
  <HelloWorld></HelloWorld>
  <button @click="counterStore.increment()">increment</button>
  <button @click="btn_increment">increment</button>
</template>

<style scoped></style>
